<template>
    <div class="all">
      <van-nav-bar class="header" title="优惠券" left-arrow @click-left="onClickLeft"/>
      <div class="p">可使用优惠券 (1)</div>
      <router-link :to="{name:'paying'}">
        <div class="main">
          <div class="p1"><span>￥20</span> 无使用门槛</div>
          <div class="p2"><span>优惠券名称</span> 满200减20</div>
        </div>  
      </router-link>>
    </div>
</template>
<script>
export default {
  name:"coupon",
  data() {
    return {
      
    }
  },
  methods : {
    onClickLeft() {
        this.$router.push({path:'/paying'});
    },
  }
}
</script>
<style scoped  lang="">
.header {
    background-color: #ff5733;
    z-index:9999;
}
.van-nav-bar .van-icon,.van-nav-bar__title {
    color:white;
}
.p{
  width:100%;
  height:.8rem;
  text-align: center;
  line-height: .8rem;
  font-size:.533333rem;
  margin-top:.533333rem;
}
.main{
  width:8rem;
  height:3.2rem;
  margin-left:.986667rem;
  margin-top:.833333rem;
  border:.026667rem solid #ccc;
  background-color: #ff5733;
}
.p1,.p2{
  color:#ccc;
  font-size:.4rem;
  margin-left:.933333rem;
}
.p1{
  margin-top:.733333rem;
}
.p1 span{
  color:white;
  font-size:0.8rem;
}
.p2{
  margin-top:0.5rem;
}
.p2 span{
  color:black;
  font-size:.5rem;
}
</style>